#home-page {
  text-align: center;
  margin-top: 16px;

  .grid {
    width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, auto);
    justify-content: space-between;
    row-gap: 16px;

    .card {
      width: 288px;
      height: 256px;
      box-shadow: 0 0 5px rgba(168, 182, 191, 60%);
      border-radius: 12px;
      transition: all .3s;

      .card-title {
        margin: 8px 0;
        color: #2c3e50;
      }

      &:hover {
        box-shadow: 0 10px 32px rgba(168, 182, 191, 60%);
      }
    }
  }
}
